<template>
  <div class="module_container">
    <div class="module_title right"
         flex>
      <!-- <div class="tab" flex>
        <div>加分行为</div>
        <div class="active" style="margin-left:-20px">减分行为</div>
      </div> -->
      <div class="title_text">加/减分情况统计</div>
    </div>
    <div class="content">
      <div ref="bar"
           class="bar" />
      <dv-decoration-2 style="width: 100%; height: 5px" />
      <dv-decoration-2 style="width: 100%; height: 5px; transform: rotate(180deg)" />
      <div flex="main:justify"
           class="margin_top_15">
        <div style="font-size: 28px; color: #bfdaff">
          本周加分事件 <b style="font-size: 36px">2,234</b>
        </div>
        <div style="font-size: 28px; color: #bfdaff">
          本周减分事件 <b style="font-size: 36px">50</b>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { optionBar } from './module6_option.js'
import Charts from '@jiaminghi/charts'
export default {
  data () {
    return {
      inforData: {}
    }
  },
  created () {
    this.$nextTick(() => {
      new Charts(this.$refs.bar).setOption(optionBar)
      // new Charts(this.$refs.line).setOption(optionLine)
    })
  }
}
</script>

<style lang="scss" scoped>
.content {
  // margin-top: 10px;
  // position: relative;
  //   width: 100%;
  //   overflow: hidden;
  padding: 35px 40px;
  font-size: 28px;
  & > .bar {
    width: 100%;
    height: 300px;
    margin-bottom: 15px;
  }
}
</style>
